<template>
    <div>
        <el-table :data="messageList"
                  @cell-click="toMessageDetail">
            <el-table-column
                    prop="title"
                    label="信息标题">
            </el-table-column>
            <el-table-column
                    prop="time"
                    label="发送时间"
                    width="105px">
            </el-table-column>
        </el-table>

        <div class="page">
            <el-pagination
                    background
                    :page-size="pageSize"
                    :page-count="totalPage"
                    :current-page="pageIndex"
                    layout="prev, pager, next"

                    :total="totalRecord">
            </el-pagination>
        </div>
    </div>
</template>

<script>
    import util from 'assets/js/util.js'

    export default {
        data() {
            return {
                messageList: [],
                totalRecord: 0,
                totalPage: 0,
                pageIndex: 0,
                pageSize: 0,
                caseId: 0,
                creditorId: 0
            }
        },
        mounted() {


            const _self = this;
            util.ajax({
                url: /*'/' + this.caseId + '/' + +this.creditorId +*/ `/message/list`,
                params: {pageSize: 10, currentPage: 0},
                success: function (data) {
                    data.data.content.forEach(_message => _self.messageList.push({
                        time: util.formatDate(_message.createDate),
                        code: _message.code,
                        title: _message.title,
                        id: _message.id,
                        viewState: _message.viewState,

                    }));
                    _self.totalRecord = data.data.totalRecord;
                        _self.currentPage = data.data.currentPage;
                        _self.pageSize = data.data.pageSize;
                        _self.totalPage = data.data.totalPage;
                        _self.pageIndex = data.data.pageIndex
                },
            });
        },
        methods: {
            toMessageDetail: function (row, column, cell, event) {
                window.location.href = '../message/message-detail.html?' + 'id=' + row.id;
            },
            /* handleCurrentChange(page) {
                 const _self = this;
                 util.ajax({
                     url: /!*'/' + this.caseId + '/' + +this.creditorId +*!/ `/message/list`,
                     params: {currentPage: page, pageSize: 10},
                     success: function (data) {
                         _self.messageList.splice(0, _self.messageList.length);
                         data.data.content.forEach(_message => _self.messageList.push({
                             time: util.formatDate(_message.createDate),
                             code: _message.code,
                             title: _message.title,
                             id: _message.id,
                             viewState: _message.viewState,

                         }));
                         _self.totalRecord = data.data.totalRecord,
                             _self.currentPage = data.data.currentPage,
                             _self.pageSize = data.data.pageSize,
                             _self.totalPage = data.data.totalPage,
                             _self.pageIndex = data.data.pageIndex
                     },
                 });
             }*/
        }
    }
</script>

<style scoped>
    .el-table th > .cell {
        text-align: center;
    }

    button {
        font-size: 18px;
    }

    el-button {
        position: absolute;
    }

    .notice-list {
        margin: 50px 8px;
        line-height: 20px;
    }

    .time {
        float: right;
        margin-right: 25px;
    }

    .page {
        text-align: center;
        position: fixed;
        bottom: 10%;
        left: 0;
        right: 0;
        width: 100%;
    }

</style>

